<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
    <input type="text" placeholder="请输入1-100之间的整数" v-model="i1">
    <input type="button" value="猜一下" @click="f()">
    <h1>结果:{{jg}}</h1>
</div>
<script src="js/Vue.js"></script>
<script>
    Vue.createApp({
        data(){
            return{
                num:parseInt(Math.random()*100+1),
                i1:"",
                jg:""
            }
        },
        methods:{
            f(){
                console.log("i1:"+this.i1);
                if (isNaN(this.i1)){
                    this.jg="输入错误"
                    return;
                }
                if (this.num>this.i1){
                    this.jg="猜小了";
                }else if (this.num<this.i1){
                    this.jg="猜大了";
                }else {
                    this.jg="恭喜你";
                }
            }
        }
    }).mount("body>div")
</script>
</body>
</html>